<template>
  <div class="desc-pic">
    <div class="desc">
        {{list.content}}
    </div>
    <div class="pic_img  clearfix">
      <div v-for="(item,index) in list.img" :key="index" class="img_li">
        <div class="img" v-lazy:background-image="item" @click="preview(index)"></div>
      </div>
    </div>
  </div>
</template>

<script>
  // import qs from 'qs'
  import wx from 'weixin-js-sdk'
  // import commonUrl from '../../common/js/commonUrl.js'
  export default {
    data () {
      return {
        ready: false
      }
    },
    props: ['list'],
    created() {
    // 初始化JSConfig
      // const url = `${commonUrl.apihost}index.php/wx/wx_jssdk/getSignPackage`
      // let data = {
      //   url: window.location.href.split('#')[0]
      // }
      // this.$http.post(url, qs.stringify(data), {headers: {'Content-Type': 'application/x-www-form-urlencoded'}}).then(res => {
      //   if (res.data.code === 200) {
      //     wx.config({
      //       debug: true,
      //       appId: res.data.data.appId,
      //       nonceStr: res.data.data.nonceStr,
      //       rawString: res.data.data.rawString,
      //       signature: res.data.data.signature,
      //       timestamp: res.data.data.timestamp,
      //       jsApiList: ['previewImage']
      //     })
      //     this.ready = true
      //   }
      // })
    },
    methods: {
      preview(index) {
        // if (this.ready) {
        wx.previewImage({
          current: this.list.img[index], // 当前显示图片的http链接
          urls: this.list.img // 需要预览的图片http链接列表
        })
        // }
      }
    }
  }
</script>

<style lang="scss">

  .desc-pic {
    padding: 10px;
    .desc {
      line-height: 16px;
      color: #292929;
      font-size: 13px;
    }
    .pic_img {
      width: 100%;
      margin-top: 7px;
      .img_li {
        width: 24%;
        height: 80px;
        margin-top: 1%;
        float: left;
        margin-left: 1%;
        background: #f2f2f2;
        .img {
          width: 100%;
          height: 100%;
          background-size: cover;
        }
      }
    }
  }
</style>
